From e303feff77936e024042dfa474097061890855b0 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Bartosz=20Dziewo=C5=84ski?= <matma.rex@gmail.com>
Date: Fri, 19 Feb 2016 22:51:43 +0100
Subject: [PATCH] mw.widgets.CalendarWidget: Lazy-initialize calendar buttons
 too

Bug: T126788
Change-Id: I9b0e67ea5b9854745928e3c63e73d701c6a83daf
---
 .../mw.widgets.CalendarWidget.js              | 82 +++++++++++--------
 1 file changed, 48 insertions(+), 34 deletions(-)

diff --git a/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.js b/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.js
index 65248490f2..3daa70ace0 100644
--- a/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.js
+++ b/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.js
@@ -50,36 +50,8 @@
 		this.$bodyOuterWrapper = $( '<div>' ).addClass( 'mw-widget-calendarWidget-body-outer-wrapper' );
 		this.$bodyWrapper = $( '<div>' ).addClass( 'mw-widget-calendarWidget-body-wrapper' );
 		this.$body = $( '<div>' ).addClass( 'mw-widget-calendarWidget-body' );
-		this.labelButton = new OO.ui.ButtonWidget( {
-			tabIndex: -1,
-			label: '',
-			framed: false,
-			classes: [ 'mw-widget-calendarWidget-labelButton' ]
-		} );
-		this.upButton = new OO.ui.ButtonWidget( {
-			tabIndex: -1,
-			framed: false,
-			icon: 'collapse',
-			classes: [ 'mw-widget-calendarWidget-upButton' ]
-		} );
-		this.prevButton = new OO.ui.ButtonWidget( {
-			tabIndex: -1,
-			framed: false,
-			icon: 'previous',
-			classes: [ 'mw-widget-calendarWidget-prevButton' ]
-		} );
-		this.nextButton = new OO.ui.ButtonWidget( {
-			tabIndex: -1,
-			framed: false,
-			icon: 'next',
-			classes: [ 'mw-widget-calendarWidget-nextButton' ]
-		} );
 
 		// Events
-		this.labelButton.connect( this, { click: 'onUpButtonClick' } );
-		this.upButton.connect( this, { click: 'onUpButtonClick' } );
-		this.prevButton.connect( this, { click: 'onPrevButtonClick' } );
-		this.nextButton.connect( this, { click: 'onNextButtonClick' } );
 		this.$element.on( {
 			focus: this.onFocus.bind( this ),
 			mousedown: this.onClick.bind( this ),
@@ -90,12 +62,9 @@
 		this.$element
 			.addClass( 'mw-widget-calendarWidget' )
 			.append( this.$header, this.$bodyOuterWrapper.append( this.$bodyWrapper.append( this.$body ) ) );
-		this.$header.append(
-			this.prevButton.$element,
-			this.nextButton.$element,
-			this.upButton.$element,
-			this.labelButton.$element
-		);
+		if ( !this.lazyInitOnToggle ) {
+			this.buildHeaderButtons();
+		}
 		this.setDate( config.date !== undefined ? config.date : null );
 	};
 
@@ -331,6 +300,50 @@
 		this.$body.on( 'click', this.onBodyClick.bind( this ) );
 	};
 
+	/**
+	 * Construct and display buttons to navigate the calendar.
+	 *
+	 * @private
+	 */
+	mw.widgets.CalendarWidget.prototype.buildHeaderButtons = function () {
+		this.labelButton = new OO.ui.ButtonWidget( {
+			tabIndex: -1,
+			label: '',
+			framed: false,
+			classes: [ 'mw-widget-calendarWidget-labelButton' ]
+		} );
+		this.upButton = new OO.ui.ButtonWidget( {
+			tabIndex: -1,
+			framed: false,
+			icon: 'collapse',
+			classes: [ 'mw-widget-calendarWidget-upButton' ]
+		} );
+		this.prevButton = new OO.ui.ButtonWidget( {
+			tabIndex: -1,
+			framed: false,
+			icon: 'previous',
+			classes: [ 'mw-widget-calendarWidget-prevButton' ]
+		} );
+		this.nextButton = new OO.ui.ButtonWidget( {
+			tabIndex: -1,
+			framed: false,
+			icon: 'next',
+			classes: [ 'mw-widget-calendarWidget-nextButton' ]
+		} );
+
+		this.labelButton.connect( this, { click: 'onUpButtonClick' } );
+		this.upButton.connect( this, { click: 'onUpButtonClick' } );
+		this.prevButton.connect( this, { click: 'onPrevButtonClick' } );
+		this.nextButton.connect( this, { click: 'onNextButtonClick' } );
+
+		this.$header.append(
+			this.prevButton.$element,
+			this.nextButton.$element,
+			this.upButton.$element,
+			this.labelButton.$element
+		);
+	};
+
 	/**
 	 * Handle click events on the "up" button, switching to less precise view.
 	 *
@@ -554,6 +567,7 @@
 	mw.widgets.CalendarWidget.prototype.toggle = function ( visible ) {
 		if ( this.lazyInitOnToggle && visible ) {
 			this.lazyInitOnToggle = false;
+			this.buildHeaderButtons();
 			this.updateUI();
 		}
 
-- 
2.20.1